<template>
    <view>
        <t-tab-bar :value="value" theme="tag" :split="false" @change="handleChange">
            <t-tab-bar-item icon="home" value="home">首页</t-tab-bar-item>
            <!-- <t-tab-bar-item icon="chat" value="workOrderList" badge-props="{{ { count: unreadNum, offset: [0, '-16rpx'] } }}">工单列表</t-tab-bar-item> -->
            <t-tab-bar-item icon="user" value="my">我的</t-tab-bar-item>
        </t-tab-bar>
    </view>
</template>

<script>
import tTabBar from './tdesign-miniprogram/tab-bar/tab-bar';
import tTabBarItem from './tdesign-miniprogram/tab-bar-item/tab-bar-item';
const app = getApp();
export default {
    components: {
        tTabBar,
        tTabBarItem
    },
    data() {
        return {
            value: '',
            // 初始值设置为空，避免第一次加载时闪烁
            unreadNum: 0,
            // 未读消息数量
            list: [
                {
                    icon: 'home',
                    value: 'index',
                    label: '首页'
                },
                {
                    icon: 'chat',
                    value: 'notice',
                    label: '消息'
                },
                {
                    icon: 'user',
                    value: 'my',
                    label: '我的'
                }
            ]
        };
    },
    mounted() {
        // 处理小程序 ready 生命周期
        this.$nextTick(() => this.ready());
    },
    methods: {
        ready() {
            const pages = getCurrentPages();
            const curPage = pages[pages.length - 1];
            if (curPage) {
                const nameRe = /pages\/(\w+)\/index/.exec(curPage.route);
                if (nameRe === null) {
                    return;
                }
                if (nameRe[1] && nameRe) {
                    this.setData({
                        value: nameRe[1]
                    });
                }
            }

            // 同步全局未读消息数量
            this.setUnreadNum(app.globalData.unreadNum);
            app.globalData.eventBus.on('unread-num-change', (unreadNum) => {
                this.setUnreadNum(unreadNum);
            });
        },

        handleChange(e) {
            const { value } = e.detail;
            uni.switchTab({
                url: `/pages/${value}/index`
            });
        },

        /** 设置未读消息数量 */
        setUnreadNum(unreadNum) {
            this.setData({
                unreadNum
            });
        }
    },
    created: function () {}
};
</script>
<style lang="less">
@import '/variable.less';

.custom-tab-bar {
    --td-tab-bar-height: @tab-bar-height;

    &-item {
        margin: 0;
        padding: 16rpx 24rpx;
    }
}
</style>
